<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="shortcut icon" href="images/camera.ico">
    <link rel="stylesheet" href="../cssClass/login.css">
    <link rel="stylesheet" href="../cssClass/public.css">
    <link rel="stylesheet" href="../cssClass/titleBarCss.css">
</head>

<body>
    <div style="width: 80%;margin: auto;">
        <!-- 头部背景+头像+登录+注册 -->
        <div class="main_div">

        </div>
        <div class="title-bar">
            <div class="title-bar-container">
                <h1 class="title-bar-title">My Website</h1>
                <nav class="title-bar-nav">
                    <ul class="titlebar">
                        <li><a href="./index.html#content11" class="nav-link">Home</a></li>
                        <li><a href="./index.html#content22" class="nav-link">article</a></li>
                        <li onclick="jumpToFn('about')"> 关于我们
                        </li>
                        <li onclick="jumpToFn('novel')">最新文章</li>
                        <li onclick="jumpToFn('message')">给我留言</li>
                    </ul>
                </nav>
            </div>
        </div>

        <!--中部-->
        <div id="login_body">
            <div class="login_b_center">
                <div class="login_bg">
                    <h1>密码登录</h1>
                    <form action="#" id="login">
                        <!--                //用户名-->
                        <div class="userName">
                            <span></span><input type="text">
                        </div>
                        <!--                //密码-->
                        <div class="password">
                            <span></span><input type="password">
                        </div>
                        <!--                //登录按钮-->
                        <div class="button" style="
                        margin-top: 50px;">
                            <p style="line-height: 40px;text-align: center;">登录</p>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        <!--尾部-->
        <div id="footer">
            <div class="link">
                关于我们
                |
                联系我们
                |
                商家入驻
                |
                友情链接
                |
            </div>
            <div class="copyright">
                Copyright © 1999 - 2020 LZH. All Rights Reserved.
            </div>
        </div>
    </div>

</body>

</html>
<script>
    function jumpToFn(item) {
        let isUrl;
        if (item == "login") {
            isUrl = "./login.html";
        } else if (item == "about") {
            isUrl = "./about.html";
        } else if (item == "register") {
            isUrl = "./register.html";
        } else if (item == "novel") {
            isUrl = "../electronicBook/index.html";
        } else if (item == "message") {
            isUrl = "./message.html";
        }
        window.location.href = isUrl;
    }
</script>